<template>
	<view>
		<!-- 只有手机号 没有支付宝授权信息，要跳转授权（h5或者app的都有） -->
		<wyb-popup ref="contactTel" type="bottom" height="350" radius="6" :showCloseIcon="true" title="测试登录">
			<view class="wrapper">
				<view class="title1">授权登录信息</view>
				<view class="title2">尊敬的用户,未检测到支付宝授权信息，需要您授权登录!</view>
				<button class="btn" hover-class="none" @click="authorizedLogin">
					支付宝授权登录
				</button>
			</view>
		</wyb-popup>
	</view>
</template>

<script>
	import {
		saveUserId,
		saveZWZUserDetail,
	} from '@/utils';
	export default {
		props: {

		},
		data() {
			return {
				appLoginAppidStr: '',
				isWxBrowser: false, //默认不是微信环境
			}
		},
		components: {},
		onLoad(e) {},
		mounted() {},
		created() {
			this.getAppLoginAppid()
			// #ifdef H5
			this.judgeBrowserEnv()
			// #endif
		},
		onReachBottom() {
			console.log('下拉到底了');
		},
		methods: {
			authorizedLogin() {
				// #ifdef H5
				this.$refs.contactTel.close();
				let backUrl = 'https://mobile.zuji.fun/'
				let alipayUrl =
					`https://openauth.alipay.com/oauth2/publicAppAuthorize.htm?app_id=${this.appLoginAppidStr}&scope=auth_user&redirect_uri=` +
					encodeURIComponent(backUrl) + '&state=init';
				let openURL = 'alipays://platformapi/startapp?appId=20000067&url=' + encodeURIComponent(alipayUrl);
				if (this.isWxBrowser) {
					//微信环境
					let weixinUrl = `https://ds.alipay.com/?scheme=${encodeURIComponent(openURL)}`
					window.location.href = weixinUrl
				} else {
					//非微信环境（浏览器环境）
					window.location.href = openURL
				}
				// #endif


				// #ifdef APP-PLUS
				this.zhifubaoLogin()
				// #endif
			},
			//app时支付宝授权拿登录
			zhifubaoLogin() {
				const AlipayAuth = uni.requireNativePlugin("DHQ-AlipayAuth")
				let that = this
				console.log('--支付宝登录===', AlipayAuth);
				AlipayAuth.login({
						appId: this.appLoginAppidStr, //你在支付宝平台申请的App ID，动态获取
						scheme: 'rich' // 需要传到支付宝SDK的scheme,注意需要在manifest.json配置
					},
					(res) => {
						console.log('app原生授权返回res', res)
						//客户端成功获取授权临时票据（code）,向业务服务器发起登录请求。
						let code = res.auth_code
						that.$request("member/mall/aliPay/user/alipayLogin", {
								authCode: code,
								source: '1',
							}, "POST")
							.then((res) => {
								console.log('支付宝授权登录后跳回app把code传给接口成功', res)
								uni.showToast({
									title: res.data,
									icon: 'none',
									duration: 10000
								});
								if (res.data.uid) {
									saveUserId(res.data.uid);
								}
								this.$refs.contactTel.close();
								uni.showToast({
									title: '授权成功!',
									icon: 'none',
									duration: 1000
								});
								let timer1 = null
								timer1 = setTimeout(() => {
									if (res.data.telephone) {
										uni.navigateBack({
											delta: 1
										});
									} else {
										this.$onTo(
											`/pagesOther/appLoginphone/appLoginphone?uid=${res.data.uid}`
											)
									}
									timer1 = null
								}, 1000); // 延迟0.5秒
							})
							.catch(res => {
								console.log('支付宝授权登录后跳回app把code传给接口报错', res)
								uni.showToast({
									title: '授权登录失败，请稍后再试',
									icon: 'none',
									duration: 2000,
								});
							})
					})
			},
			getAppLoginAppid() {
				this.$request('member/mall/aliPay/user/getAppPlatFormAppId', {}, 'get', false, true).then((res) => {
					if (res.businessSuccess || res.success) {
						this.appLoginAppidStr = res.data
					}
				});
			},
			toLogin() {
				this.$refs.contactTel.show();
			},
			//判断当前浏览器环境
			judgeBrowserEnv() {
				let ua = navigator.userAgent.toLowerCase(); // 这里将所有字母转小写
				// let isWxBrowser = ua.indexOf('micromessenger') !== -1 //微信环境
				if (ua.indexOf('micromessenger') !== -1) {
					this.isWxBrowser = true
				} else {
					this.isWxBrowser = false
				}
			},
		}
	};
</script>

<style lang="less" scoped>
	.wrapper {
		width: 100%;

		.title1 {
			margin: 30rpx auto 50rpx auto;
			text-align: center;
		}

		.title2 {
			margin-left: 20rpx;
			margin-bottom: 50rpx;
		}

		.btn {
			width: 80%;
			height: auto;
			border: none;
			background-color: #be9364;
			color: #ffffff;
			margin: 0 auto;
			letter-spacing: 0.1em;
			border-radius: 10rpx;
		}
	}
</style>